<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>兼容各种浏览器的纯CSS三级下拉导航菜单</title>
<h2>Hello World!
<textarea rows="30" cols="50" name="editor01">请输入.</textarea>
<script type="text/javascript" src="<%=basePath %>ckeditor/ckeditor.js"></script>
<script type="text/javascript" src="<%=basePath %>js/jquery-1.8.2.js"></script>
<script type="text/javascript" src="<%=basePath %>ckeditor/ckeditor.js"></script>

<script type="text/javascript">
    window.onload = function()
    {
        CKEDITOR.replace( 'editor01' );
        
    };
</script>
</h2>
<!--把下面代码加到<head>与</head>之间-->
<style type="text/css">


.menu {
	font-family: verdana, sans-serif;

	position: relative;
	color:#000;
	font-size:13px;
	padding-bottom: 250px;
}

.menu ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
}

.menu ul li {
	float: left;
	position: relative;
}

.menu ul li a,.menu ul li a:visited {
	display: block;
	text-decoration: none;
	color: #000;
	width: 60px;
	height: 3em;
	color: #000;
	border: 1px solid #fff;
	border-width: 1px 1px 0 0;
	background: #bd8d5e;
	padding-left: 10px;
	line-height: 3em;
	color:#000;
	font-size:13px;
}

* html .menu ul li a,.menu ul li a:visited {
	width: 60px;
	width: 60px;
	color:#000;
	font-size:13px;
}

.menu ul li ul {
	display: none;
}

.menu table {
	margin: -1px;
	border-collapse: collapse;
	font-size: 1em;
}
/* specific to non IE browsers */
.menu ul li:hover a {
	color: #000;
	background: #bd8d5e;
}

.menu ul li:hover ul {
	display: block;
	position: absolute;
	top: 3em;
	margin-top: 1px;
	left: 0;
	width: 150px;
}

.menu ul li:hover ul li ul {
	display: none;
}

.menu ul li:hover ul li a {
	display: block;
	background: #faeec7;
	color: #000;
	height: auto;
	line-height: 1.2em;
	padding: 5px 10px;
	width: 129px
}

.menu ul li:hover ul li a.drop {
	background: #c9c9a7;
}

.menu ul li:hover ul li a:hover {
	background: #c9c9a7;
	color: #000;
}

.menu ul li:hover ul li:hover ul {
	display: block;
	position: absolute;
	left: 150px;
	top: 0;
	width: 150px;
}

.menu ul li:hover ul li:hover ul.left {
	left: -150px;
}
</style>
<!--[if lte IE 6]>
<style type="text/css">
.menu ul li a:hover {
color:#fff; 
background:#bd8d5e;
}
.menu ul li a:hover ul {
display:block; 
position:absolute; 
top:3em; 
left:0;
background:#fff;
margin-top:0;
margin-top:1px;
}
.menu ul li a:hover ul li a {
display:block; 
background:#dbe4ab; 
color:#000; 
height:auto; 
line-height:1.5em; 
padding:5px 10px; 
width:150px;
width:129px;
}
.menu ul li a:hover ul li a.drop {
background:#c9c9a7;
}
.menu ul li a:hover ul li a ul {
visibility:hidden; 
position:absolute; 
height:0; 
width:0;
}
.menu ul li a:hover ul li a:hover {
background:#c9c9a7; color:#000;
}
.menu ul li a:hover ul li a:hover ul {
visibility:visible; 
position:absolute; 
top:0; 
color:#000;
left:150px;
}
.menu ul li a:hover ul li a:hover ul.left {
left:-150px;
}
</style>
<![endif]-->
</head>
<body>
	<!--把下面代码加到<body>与</body>之间-->
	<div class="menu">
		<ul>
			<li><a class="drop" href="#">首页 <!--[if IE 7]><!-->
			</a></li>
			<li><a href="#">学院概况 <!--[if IE 7]><!-->
			</a> <!--<![endif]-->
				<table>
					<tr>
						<td>
							<ul>
								<li><a href="#" title="a coded list of spies">学院简介</a></li>
								<li><a href="#" title="a horizontal vertical menu">组织机构</a></li>
								<li><a class="drop" href="#"
									title="Hover/click with no active/focus borders">专业介绍 <!--[if IE 7]><!-->
								</a> <!--<![endif]-->
									<table>
										<tr>
											<td>
												<ul>
													<li><a href="#" title="Styling forms">物联网</a></li>
													<li><a href="#" title="Removing active/focus borders">软件工程</a></li>
													<li><a href="http://www.111cn.net"
														title="Hover/click with no active/focus borders">信息与计算科学</a></li>
													<li><a href="http://www.111cn.net"
														title="Hover/click with no active/focus borders">数学与应用数学</a></li>
													<li><a href="http://www.111cn.net"
														title="Hover/click with no active/focus borders">计算机科学与技术</a></li>
												</ul>
											</td>
										</tr>
									</table> <!--[if lte IE 6]>
</a>
<![endif]--></li>
								<li><a class="drop" href="#"
									title="Hover/click with no active/focus borders">办公室 <!--[if IE 7]><!-->
								</a> <!--<![endif]-->
									<table>
										<tr>
											<td>
												<ul>
													<li><a href="#" title="Styling forms">教学办公室</a></li>
													<li><a href="#" title="Removing active/focus borders">党政办公室</a></li>
													<li><a href="http://www.111cn.net"
														title="Hover/click with no active/focus borders">学生工作办公室</a></li>
												</ul>
											</td>
										</tr>
									</table> <!--[if lte IE 6]>
</a>
<![endif]--></li>
								<li><a class="drop" href="#"
									title="Hover/click with no active/focus borders">研究所 <!--[if IE 7]><!-->
								</a> <!--<![endif]-->
									<table>
										<tr>
											<td>
												<ul>
													<li><a href="#" title="Styling forms">应用数学研究所</a></li>
													<li><a href="#" title="Removing active/focus borders">计算机应用研究所</a></li>
													<li><a href="http://www.111cn.net"
														title="Hover/click with no active/focus borders">计算机软件研究所</a></li>
												</ul>
											</td>
										</tr>
									</table> <!--[if lte IE 6]>
</a>
<![endif]--></li>

							</ul>
						</td>
					</tr>
				</table> <!--[if lte IE 6]>
</a>
<![endif]--></li>
			<li><a href="#">新闻公告<!--[if IE 7]><!-->
			</a> <!--<![endif]-->
				<table>
					<tr>
						<td>
							<ul>
								<li><a href="#" title="新闻">新闻</a></li>
								<li><a href="#" title="公告">公告</a></li>

							</ul>
						</td>
					</tr>
				</table> <!--[if lte IE 6]>
</a>
<![endif]--></li>
			<li><a href="#">人才培养<!--[if IE 7]><!-->
			</a> <!--<![endif]-->
				<table>
					<tr>
						<td>
							<ul>
								<li><a class="drop" href="#"
									title="Hover/click with no active/focus borders">本科培养 <!--[if IE 7]><!-->
								</a> <!--<![endif]-->
									<table>
										<tr>
											<td>
												<ul>
													<li><a href="#" title="Styling forms">物联网</a></li>
													<li><a href="#" title="Removing active/focus borders">软件工程</a></li>
													<li><a href="http://www.111cn.net"
														title="Hover/click with no active/focus borders">信息与计算科学</a></li>
													<li><a href="http://www.111cn.net"
														title="Hover/click with no active/focus borders">数学与应用数学</a></li>
													<li><a href="http://www.111cn.net"
														title="Hover/click with no active/focus borders">计算机科学与技术</a></li>
												</ul>
											</td>
										</tr>
									</table> <!--[if lte IE 6]>
</a>
<![endif]--></li>
								<li><a href="http://mb.111cn.net" title="Weft fonts">研究生培养
								</a></li>
								<li><a class="drop" href="#"
									title="Hover/click with no active/focus borders">一级硕士点 <!--[if IE 7]><!-->
								</a> <!--<![endif]-->
									<table>
										<tr>
											<td>
												<ul>
													<li><a href="#" title="Styling forms">软件工程</a></li>
													<li><a href="#" title="Removing active/focus borders">计算机科学与技术</a></li>

												</ul>
											</td>
										</tr>
									</table> <!--[if lte IE 6]>
</a>
<![endif]--></li>
								<li><a class="drop" href="#"
									title="Hover/click with no active/focus borders">二级硕士点 <!--[if IE 7]><!-->
								</a> <!--<![endif]-->
									<table>
										<tr>
											<td>
												<ul>
													<li><a href="#" title="Styling forms">信息安全</a></li>
													<li><a href="#" title="Removing active/focus borders">应用数学</a></li>
													<li><a href="#" title="Removing active/focus borders">数学与应用数学</a></li>
													<li><a href="#" title="Removing active/focus borders">计算机应用技术</a></li>
													<li><a href="#" title="Removing active/focus borders">计算机软件与理论</a></li>
												</ul>
											</td>
										</tr>
									</table> <!--[if lte IE 6]>
</a>
<![endif]--></li>
								<li><a href="<%=basePath%>rcpy/xkjs">学科建设</a></li>
								<li><a href="<%=basePath%>yxxy">优秀校友</a></li>
							</ul>
						</td>
					</tr>
				</table> <!--[if lte IE 6]>
</a>
<![endif]--></li>
			<li class="heng"><a href="<%=basePath%>teacherdw/teacherdwindex">师资队伍</a></li>
			<li class="heng"><a href="<%=basePath%>scienceyj/scienceyjindex">科学研究</a></li>
			<li class="heng"><a href="<%=basePath%>djzc/djzcindex">党建之窗</a></li>
			<li><a href="#">学生工作 <!--[if IE 7]><!-->
			</a> <!--<![endif]-->
				<table>
					<tr>
						<td>
							<ul>
								<li><a href="<%=basePath%>studentwork/studentworkindex">学生工作</a></li>
								<li><a href="<%=basePath%>yxxy">优秀校友</a></li>
							</ul>
						</td>
					</tr>
				</table> <!--[if lte IE 6]>
</a>
<![endif]--></li>
			<li class="heng"><a href="<%=basePath%>zsjy/zsjyindex">招生就业</a></li>

			<li class="heng"><a href="<%=basePath%>jpkc">精品课程</a></li>
			<li class="heng"><a href="<%=basePath%>mooc">MOOC</a></li>
			<li class="heng"><a
				href="<%=basePath%>filedownload/filedownloadindex" style="">资料下载</a></li>
		</ul>
	</div>
</body>
</html>